<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>XiaoqiangApps</title>
    <link
      rel="icon"
      href=""
      type="image/x-icon"
    />
    <style>
      /* 作者：Xiaoqiang
微信公众号：XiaoqiangClub
创建时间：2025-11-10 06:10:25
*/

      body {
        font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
        margin: 0;
        padding: 0;
        background-color: #f4f7f6;
        color: #333;
        line-height: 1.6;
      }

      header {
        background-color: #2c3e50;
        color: #ffffff;
        padding: 2rem 0;
        text-align: center;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
      }

      header h1 {
        margin: 0;
        font-size: 2.5rem;
      }

      header p {
        font-size: 1.1rem;
        opacity: 0.9;
      }

      main {
        padding: 20px;
        max-width: 1200px;
        margin: 20px auto;
      }

      #app-container {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: 20px;
        padding: 20px 0;
      }

      .app-card {
        background-color: #ffffff;
        border-radius: 12px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
        overflow: hidden;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        display: flex;
        flex-direction: column;
        text-align: center;
        padding: 20px;
        border: 1px solid #e0e0e0;
      }

      .app-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
      }

      .app-card img {
        width: 90px;
        height: 90px;
        object-fit: contain;
        margin: 0 auto 15px auto;
        border-radius: 50%;
        border: 3px solid #3498db;
        padding: 5px;
        background-color: #ecf0f1;
      }

      .app-card h2 {
        font-size: 1.4rem;
        color: #2c3e50;
        margin-top: 10px;
        margin-bottom: 8px;
      }

      .app-card p {
        font-size: 0.95rem;
        color: #7f8c8d;
        flex-grow: 1;
        margin-bottom: 20px;
      }

      footer {
        text-align: center;
        padding: 2rem 0;
        background-color: #2c3e50;
        color: #ffffff;
        font-size: 0.9rem;
        margin-top: 40px;
        box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.05);
      }

      @media (max-width: 768px) {
        header h1 {
          font-size: 2rem;
        }
        #app-container {
          grid-template-columns: 1fr;
        }
      }
    </style>
  </head>
  <body>
    <header>
      <h1>XiaoqiangClub</h1>
      <p>自用应用，请多指教</p>
    </header>
    <main id="app-container">
      <!-- 应用卡片将在这里动态加载 -->
    </main>
    <footer>
      <p>
        &copy; 2025
        <a href="https://xiaoqiangclub.github.io/" target="_blank" rel="noopener" style="text-decoration: none; color: red;">XiaoqiangClub</a>. All rights reserved.
      </p>
    </footer>
    <script>
      /* 作者：Xiaoqiang
微信公众号：XiaoqiangClub
创建时间：2025-11-10T06:10:40.000Z
*/

      document.addEventListener("DOMContentLoaded", () => {
        const appContainer = document.getElementById("app-container");

        const appData = {
          home_interface: [
            {
              app_name: "🎈 Follow Me",
              app_desc: "XiaoqiangClub 💋",
              download_url: "https://xiaoqiangclub.github.io/",
              logo_img_url:
                "https://s2.loli.net/2025/07/27/ZmzSQsgpKOM2xBk.png",
            },
            {
              app_name: "豆瓣追剧助手",
              app_desc: "豆瓣自动追剧",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/144786995",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/Z9o7dTrVE1DmzAq.png",
            },
            {
              app_name: "抖音助手",
              app_desc: "抖音无水印下载/文案提取",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/145859612",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/QDfwBPcN34i18Yz.png",
            },
            {
              app_name: "桌面时钟",
              app_desc: "时间、日期、天气，一目了然！",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/135819194",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/WjGSPOmTBpEsZuQ.png",
            },
            {
              app_name: "Csdn助手",
              app_desc: "CSDN博客下载助手",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/134625819",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/f6l5sadcHPSMBEb.png",
            },
            {
              app_name: "股市助手",
              app_desc: "股市快讯语音播报",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/146474177",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/VeDMGXpFx47YlkH.png",
            },
            {
              app_name: "Cookie助手",
              app_desc: "一键获取网页Cookie",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/135557997",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/xE8nsrCvUG76HdN.png",
            },
            {
              app_name: "PyWinInspect",
              app_desc: "窗口元素检查工具",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/154634270",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/M9lnJxgeLATjc3W.png",
            },
            {
              app_name: "目录树生成器",
              app_desc: "一键生成目录树",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/142367860",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/EFt9LblmHn1TV7j.png",
            },
            {
              app_name: "Cloudflare助手",
              app_desc: "CloudflareDns记录批量删除",
              download_url:
                "https://xiaoqiangclub.blog.csdn.net/article/details/139810246",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/lrmJd17BfMb8cpE.png",
            },
            {
              app_name: "网盘资源",
              app_desc: "实用资源，免费分享！",
              download_url:
                "https://pan.xunlei.com/s/VNv5IQ0Ivh4-FKUrhsAjdphEA1?pwd=ipj8",
              logo_img_url:
                "https://s2.loli.net/2025/08/05/M7Wtghflm3HoPZC.png",
            },
            {
              app_name: "支持我",
              app_desc: "请我喝咖啡~",
              download_url:
                "https://s2.loli.net/2025/11/10/EeYnifGrmFx2CWo.jpg",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/P8FyS2tM43J6DCN.png",
            },
            {
              app_name: "联系我",
              app_desc: "xiaoqiangclub@hotmail.com",
              download_url: "mailto:xiaoqiangclub@hotmail.com",
              logo_img_url:
                "https://s2.loli.net/2025/11/10/IWuL8YPg5l79ohA.png",
            },
          ],
        };

        appData.home_interface.forEach((app) => {
          const appCard = document.createElement("div");
          appCard.className = "app-card";

          const appLogo = document.createElement("img");
          appLogo.src = app.logo_img_url;
          appLogo.alt = app.app_name + " Logo";

          const appName = document.createElement("h2");
          appName.textContent = app.app_name;

          const appDesc = document.createElement("p");
          appDesc.textContent = app.app_desc;

          appCard.appendChild(appLogo);
          appCard.appendChild(appName);
          appCard.appendChild(appDesc);
          appCard.style.cursor = "pointer"; // Add cursor style to indicate clickability
          appCard.addEventListener("click", () => {
            window.open(app.download_url, "_blank");
          });

          appContainer.appendChild(appCard);
        });
      });
    </script>
  </body>
</html>
